import React from 'react';
import ReactDOM from 'react-dom';
import { createHashHistory } from 'History';
import { Router, Route, useRouterHistory } from 'react-router';
import { syncHistoryWithStore, RouterStore } from 'mobx-react-router';
import { Provider } from 'mobx-react';

import { WeaErrorPage } from 'ecCom';

import WeaFavourite from './index';


const routing = new RouterStore();
const stores = WeaFavourite.stores;
const routes = WeaFavourite.routes;

const allStore = {
  routing,
  ...stores,
};

const browserHistory = useRouterHistory(createHashHistory)({
  queryKey: '_key',
  basename: '/',
});

const history = syncHistoryWithStore(browserHistory, allStore.routing);

const Home = props => props.children;

const Root = () => (
  <Provider ecId={`${this && this.props && this.props.ecId || ''}_Provider@7by9s3`} {...allStore}>
    <Router ecId={`${this && this.props && this.props.ecId || ''}_Router@a50khz`} history={history}>
      <Route ecId={`${this && this.props && this.props.ecId || ''}_Route@0k876i`} name="main" breadcrumbName="入口" path="/main" component={Home}>
        {routes}
      </Route>
    </Router>
  </Provider>
);

ReactDOM.render(<Root ecId={`${this && this.props && this.props.ecId || ''}_Root@u179ej`} />, document.getElementById('container'));
